<!doctype html>
<html>
<head>
    
    <meta charset="utf-8">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <title>LOOPY (v1.0)</title>

    <!-- Styles! -->
	<link href="css/loopy.css" rel="stylesheet"/>

</head>
<body style="opacity:0">

	<!-- Loopy & Ink -->
	<div id="canvasses"></div>

	<!-- The Tools' UI -->
	<div id="toolbar"></div>
	<div id="playbar"></div>
	<div id="sidebar"></div>

	<!-- Cursor -->
	<div id="cursor"><img src="css/cursors/ink.png" width="30" height="30"/></div>

	<!-- MODAL -->
	<!--div id="modal_container">
		<div id="modal_bg"></div>
		<div id="modal">
			<div id="modal_close">[×] CLOSE</div>
			<div id="modal_page"></div>
		</div>
	</div-->

</body>
</html>

<!-- Scripts! -->

<!-- Libraries -->
<script src="js/helpers.js"></script>
<script src="js/minpubsub.js"></script>
<script src="js/Mouse.js"></script>
<script src="js/Key.js"></script>

<!-- Core Simulation Code -->
<script src="js/Loopy.js"></script>
<script src="js/Model.js"></script>
<script src="js/Node.js"></script>
<script src="js/Edge.js"></script>
<script src="js/Label.js"></script>

<!-- Tools -->
<script src="js/PageUI.js"></script>
<script src="js/Sidebar.js"></script>
<script src="js/Toolbar.js"></script>
<script src="js/PlayControls.js"></script>
<script src="js/Modal.js"></script>
<script src="js/Ink.js"></script>
<script src="js/Dragger.js"></script>
<script src="js/Eraser.js"></script>
<script src="js/Labeller.js"></script>

<!-- Start it -->
<script>
window.onload = function(){
	window.loopy = new Loopy();
};
</script>